<template>
  <div>
    <van-cell-group>
      <van-field type="text" @change="getWxUserEmail" label="电子邮件" placeholder="请输入电子邮件" left-icon="envelop-o" required clearable autofocus>
      </van-field>
      <van-field type="number" @change="getVerifyCode" label="验证码" placeholder="请输入验证码" maxlength="4" left-icon="comment-o" required clearable>
        <van-button type="primary" @click="judge" :disabled="!send" size="small" slot="button">{{message}}</van-button>
      </van-field>
      <van-button type="primary" @click="register" size="large">提交</van-button>
    </van-cell-group>
    <van-toast id="van-toast"></van-toast>
  </div>
</template>

<script>
  import userAPI from '@/api/userAPI'
  import verify from '@/utils/verify'
  import time from '@/utils/time'
  import Toast from '@/../static/vant-weapp/toast/toast'

  export default {
    name: 'register',
    data () {
      return {
        wxUserId: '',
        wxUserEmail: '',
        verifyCode: '',
        send: true,
        message: '发送验证码'
      }
    },
    onShow () {
      var that = this
      that.getWxUserId()
    },
    methods: {
      getWxUserEmail (e) {
        var that = this
        that.wxUserEmail = e.mp.detail
      },
      getVerifyCode (e) {
        var that = this
        that.verifyCode = e.mp.detail
      },
      register () {
        var that = this
        if (!verify.verifyMail(that.wxUserEmail)) {
          Toast.fail({
            message: '邮箱有误',
            forbidClick: true
          })
          return
        }
        if (that.verifyCode.length !== 4) {
          Toast.fail({
            message: '验证码有误',
            forbidClick: true
          })
          return
        }
        var param = {
          verifyName: that.wxUserEmail,
          verifyCode: that.verifyCode
        }
        userAPI.verifyCode(param).then(result => {
          if (result.data) {
            wx.getUserInfo({
              success (result) {
                var sessionKey = wx.getStorageSync('sessionKey')
                var param = {
                  wxUserId: that.wxUserId,
                  wxUserEmail: that.wxUserEmail,
                  encryptedData: result.encryptedData,
                  iv: result.iv,
                  sessionKey: sessionKey
                }
                userAPI.register(param).then(result => {
                  wx.redirectTo({
                    url: '/pages/index/index'
                  })
                })
              }
            })
          } else {
            Toast.fail({
              message: '验证码有误',
              forbidClick: true
            })
          }
        })
      },
      judge () {
        var that = this
        if (!that.send) {
          return
        }
        if (!verify.verifyMail(that.wxUserEmail)) {
          Toast.fail({
            message: '邮箱有误',
            forbidClick: true
          })
          return
        }
        var param = {
          wxUserEmail: that.wxUserEmail
        }
        userAPI.judge(param).then(result => {
          if (result.code === 500) {
            Toast.fail({
              message: result.message,
              forbidClick: true
            })
          } else {
            that.sendVerifyCode()
          }
        })
      },
      sendVerifyCode () {
        var that = this
        var param = {
          verifyName: that.wxUserEmail
        }
        userAPI.sendVerifyCode(param).then(result => {
          if (result.code === 200) {
            Toast.success({
              message: result.message,
              forbidClick: true
            })
            that.send = false
            time.countDown(that, 60 * 1000)
          }
        })
      },
      getWxUserId () {
        var that = this
        userAPI.id().then(result => {
          that.wxUserId = result.message
        })
      }
    }
  }
</script>

<style scoped>
</style>
